import React, { useEffect, useState } from 'react';
import s from './style.module.css';
import {Switch,Confirm,Message} from '@knownsec/react-component';
import { logSwitch } from '~/API/index';

export default function LogSet() {
  const [operateLog,setOperateLog]=useState()
  const [loginLog,setLoginLog]=useState()
  const getData=async ()=>{
    const res=await logSwitch()
    if(res.status=== 'success'){
      setOperateLog(res.data.operate_log)
      setLoginLog(res.data.login_log)
    }
  }
  const postDate=async (type,val)=>{
    const params={"login_log": loginLog, "operate_log": operateLog}
    params[type]=val
    const res=await logSwitch(params,'POST')
    if(res.status=== 'success'){
      setOperateLog(res.data.operate_log)
      setLoginLog(res.data.login_log)
      Message.show({
        pro: true,
        type: 'success',
        message: '修改成功',
        showClose: false,
      });
    }
  }
  const showTips=(type)=>{
    Confirm({
      title: '提示',
      pro: true,
      className:s.confirmOutbox,
      message: (<div >若关闭日志记录功能，则该日志将停止记录，您确定要关闭吗</div>),
      onconfirm: async () => {
        if(type==='operate_log'){
          setOperateLog(false);
        }else{
          setLoginLog(false)
        }
        postDate(type,false)
      },
      oncancel: () => {
        if(type==='operate_log'){
          setOperateLog(true);
        }else{
          setLoginLog(true)
        }
      },
    });
  }
  useEffect(() => {
    getData()
  }, []);
  return (
    <div className={s.main}>
      <div>启用日志记录：</div>
      <div className={s.sBox}>
        <span>操作日志</span>
        <Switch
          pro
          onChange={(bool) => {
            setOperateLog(bool)
            if(!bool){
              showTips('operate_log')
            }else{
              postDate('operate_log',bool)
            }
          }}
          checked={operateLog}
        />
      </div>
      <div className={s.sBox}>
        <span>登录日志</span>
        <Switch
          pro
          onChange={(bool) => {
            setLoginLog(bool)
            if(!bool){
              showTips('login_log')
            }else{
              postDate('login_log',bool)
            }
          }}
          checked={loginLog}
        />
      </div>
    </div>
  );
}
